<template>
  <view class="container">

    <view class="avatar">
      <!-- 上传组件 -->
      <span>微信头像</span>
      <u-upload name="product_img" :maxCount="1" :fileList="filelist" width="100" height="100" />
    </view>
    <view class="avatar">
      <span>身份证</span>
      <!-- 上传组件 -->
      <u-upload name="product_img" :maxCount="2" :fileList="filelist1" width="100" height="100" />
    </view>
    <view class="content">
      <u-form labelPosition="left" labelWidth="60" :model="buslevel" ref="product">
        <!-- 名称 -->
        <u-form-item label="微信昵称" prop="nickname">
          <u-input v-model="buslevel.nickname" disabled />
        </u-form-item>

        <!-- 商品描述 -->
        <u-form-item label="申请人手机号" borderBottom>
          <u-input disabled v-model="buslevel.mobile" placeholder="申请人手机号未知" />
        </u-form-item>
        <u-form-item label="申请单号" borderBottom>
          <u-input disabled v-model="buslevel.code" placeholder="申请单号未知" />
        </u-form-item>

        <view class="Box">
          <view v-for="(value, key) in buslevel.numlist" :key="key" class="checkbox-container">
            <checkbox @click="changebox({ id: value.id, checked: value.checked, num: value.num })" class="checkbox"
              :checked="JSON.parse(value.checked)"></checkbox>
            <text class="service-name">{{ value.title }}</text>
            <input class="service-count" disabled="true" type="number" v-model="value.num" />
          </view>
        </view>

        <u-form-item label="真实姓名" >
          <u-input v-model="buslevel.realnickname" placeholder="真实姓名未知" disabled />
        </u-form-item>
        <u-form-item label="证件号" >
          <u-input v-model="buslevel.idcard" placeholder="身份证号未知" disabled />
        </u-form-item>
        <u-form-item
						label="申请原因"
						prop="intro"
						borderBottom
						ref="item3"
					>
						<u-textarea
							placeholder="申请原因未知"
              disabled
							v-model="buslevel.content"
							count
						></u-textarea>
					</u-form-item>

        <!-- 参数3 -->
        <u-form-item label="创建时间" prop="createtime_text">
          <u-input v-model="buslevel.createtime_text" disabled />
        </u-form-item>



        <u-button text="确定审批" icon="pushpin"  v-if="buslevel.status==1" size="small" type="success" :customStyle="btnStyle" @click="show = true" />
        <view style="margin-top: 15px;">
          <u-button text="拒绝审批" icon="pushpin" v-if="buslevel.status==1" size="small" type="error" :customStyle="btnStyle" @click="show1 = true" />
        </view>

      </u-form>

      <!-- 模态框 -->
      <u-modal :show="show" :content="content" showCancelButton @confirm="confirm" @cancel="cancel" />
      <u-modal :show="show1" :content="content1"  showCancelButton @confirm="confirm1" @cancel="cancel1" />
    </view>
    <!-- 消息提醒 -->
    <u-toast ref="notice"></u-toast>
  </view>
</template>

<script>
export default {
  onLoad(options) {
    console.log(options)
    this.auth = this.$u.auth.check();


    this.supid = options.supid ? options.supid : 0
    this.busid = options.busid ? options.busid : 0

    this.list();
  },


  created() {
    this.timer = setInterval(() => {
      let a = this.$u.count.check();
    }, 15000);
  },
  beforeDestroy() {
    clearInterval(this.timer);
  },
  data() {
    return {
      filelist: [],
      filelist1: [],
      show:false,
      show1:false,
      auth: {},
      content: "是否通过审批",
      content1: "是否拒绝审批",
      supid: 0,
      busid: 0,
      thumbs_text: "",
      buslevel: {

      },
      piclist: [],


    }
  },
  methods: {
     confirm() {
      this.show =  false
      this.product()
    },
     confirm1() {
      this.show1 =  false
      this.reject()

    },
    cancel1()
    {
      this.show1 = false
    },
    cancel()
    {
      this.show = false
    },


    async list() {
      let data = {
        supid: this.supid,
        adminid: this.auth.id,
        busid: this.busid
      };
      let result = await this.$u.api.depot.sellerinfo(data);
      if (result.code) {
        this.buslevel = result.data;

        if (this.buslevel.avatar) {
          // 把一维数组循环出来然后组装一个自己想要的结构
          this.filelist = [{ url: this.buslevel.avatar }];
        }

        if (this.buslevel.thumbs_text.length > 0) {
          this.filelist1 = this.buslevel.thumbs_text.map((item) => {
            return {
              url: item,
            };
          });
        }

      } else {
        this.$refs.notice.show({
          type: "warning",
          message: result.msg,
        });
      }
    },
    async reject() { 
      let data = {
        adminid: this.auth.id,
        supid: this.supid,
        busid: this.busid
      }

      let result = await this.$u.api.depot.sellerreject(data)
      if (result.code) {
        this.$refs.notice.show({
          type: "success",
          message: result.msg,
          duration: 1200,
          complete: () => {
            uni.$u.route({
              url: "/pagesD/shenpi/index"
            })
          }
        })

      } else {
        this.$refs.notice.show({
          type: "danger",
          message: result.msg,
          duration: 1200,

        })
      }
    },

    async product() {
      let data = {
        adminid: this.auth.id,
        supid: this.supid,
        busid: this.busid
      }

      let result = await this.$u.api.depot.selleraction(data)
      if (result.code) {
        this.$refs.notice.show({
          type: "success",
          message: result.msg,
          duration: 1200,
          complete: () => {
            uni.$u.route({
              url: "/pagesD/shenpi/index"
            })
          }
        })

      } else {
        this.$refs.notice.show({
          type: "danger",
          message: result.msg,
          duration: 1200,

        })
      }
    }

  }
}
</script>

<style>
.Box {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}

.checkbox-container {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

.checkbox {
  margin-left: 6px;
}

.service-name {
  /* flex: 1; */
  width: 76px;
  margin-left: 3px;
  font-size: 15px;
}

.service-count {
  width: 25px;
}

.content {
  padding: 20px;
}

.container {
  height: 100%;
  margin: 0 50rpx;
  box-sizing: border-box;
}

.avatar {
  text-align: center;
  /* display: flex; */
  /* align-items: center; */
}

.u-avatar {
  margin: 80rpx auto 40rpx;
}

.xcx {
  width: 200rpx;
  height: 200rpx;
  margin: 80rpx auto 40rpx;
  border-radius: 100%;
  overflow: hidden;
}

.nickname {
  font-size: 14px;
  text-align: center;
}

.name {
  text-align: center;
  margin: 40rpx 0;
  font-size: 14rpx;
}

.avatar .u-upload {
  justify-content: center;
  align-items: center;
  margin: 3em auto;
}

.vedio .u-upload {
  justify-content: center;
  align-items: center;
  margin: 0.3em auto;
}

.vedio {
  text-align: center;
}

.u-vedio {
  margin: 80rpx auto 40rpx;
}
</style>